import html2canvas from 'html2canvas'
import JsPDF from 'jspdf'
export default {
	install (Vue, options) {
		Vue.prototype.getPdfFromHtml = function (ele, pdfFileName) {
			const eleW = ele.offsetWidth// 获得该容器的宽
			//   let eleH = ele.offsetHeight // 获得该容器的高
			const eleH = ele.scrollHeight// 获得该容器的高
			const eleOffsetTop = ele.offsetTop// 获得该容器到文档顶部的距离
			const eleOffsetLeft = ele.offsetLeft// 获得该容器到文档最左的距离
			var canvas = document.createElement('canvas')
			// var abs = 0
			// const win_in = document.documentElement.clientWidth // 获得当前可视窗口的宽度（不包含滚动条）
			// const win_out = window.innerWidth// 获得当前窗口的宽度（包含滚动条）
			// if (window.innerWidth > document.documentElement.clientWidth) {
			// 	abs = (window.innerWidth - document.documentElement.clientWidth) / 2// 获得滚动条宽度的一半
			// }
			canvas.width = eleW // * 2// 将画布宽&&高放大两倍
			canvas.height = eleH // * 2
			var context = canvas.getContext('2d')
			context.scale(2, 2) // 增强图片清晰度
			// context.translate(-eleOffsetLeft - abs, -eleOffsetTop)
			ele.style.width = document.getElementsByClassName('el-table__header-wrapper')[0].scrollWidth + 'px'
			html2canvas(ele, {
				x: eleOffsetLeft,
				y: eleOffsetTop,
				allowTaint: true,
				dpi: 192,
				// width: document.getElementsByClassName('el-table__header-wrapper')[0].scrollWidth,
				// scale: 2,
				useCORS: true// 允许canvas画布内可以跨域请求外部链接图片, 允许跨域请求。
			}).then(canvas => {
				ele.style.width = eleW + 'px'
				var contentWidth = canvas.width
				var contentHeight = canvas.height // 595.28   // 1191.6  1683.8
				var pageHeight = (contentWidth / 592.28) * 841.89 // 这样写的目的在于保持宽高比例一致 pageHeight/canvas.width = a4纸高度/a4纸宽度// 宽度和canvas.width保持一致
				// 未生成pdf的html页面高度
				var leftHeight = contentHeight
				// 页面偏移
				var position = 0
				// a4纸的尺寸[595.28,841.89],单位像素，html页面生成的canvas在pdf中图片的宽高
				var imgWidth = 592.28 // 595.28
				var imgHeight = (592.28 / contentWidth) * contentHeight
				var pageData = canvas.toDataURL('image/jpeg', 1.0)
				var pdf = new JsPDF('', 'pt', 'a4')
				// 有两个高度需要区分，一个是html页面的实际高度，和生成pdf的页面高度(841.89)
				// 当内容未超过pdf一页显示的范围，无需分页
				if (leftHeight < pageHeight) {
					// 在pdf.addImage(pageData, 'JPEG', 左，上，宽度，高度)设置在pdf中显示；
					pdf.addImage(pageData, 'JPEG', 5, 30, imgWidth, imgHeight) // 0 ,100
				} else {
					while (leftHeight > 0) {
						pdf.addImage(pageData, 'JPEG', 5, position, imgWidth, imgHeight)
						leftHeight -= pageHeight
						position -= 841.89
						if (leftHeight > 0) {
							pdf.addPage()
						}
					}
				}
				pdf.save(pdfFileName + '.pdf')
			})
		}
	}
}
